<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <script type="text/javascript" src="./script/rem.js"></script>
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="./css/font-awesome.css" />
    <link rel="stylesheet" type="text/css" href="./css/style.css" />
    <script type="text/javascript" src="./script/jquery.min.js"></script>
    <script type="text/javascript" src="./script/aui-slide.js"></script>
    <script type="text/javascript" src="./script/jquery.min.js"></script>
    <script type="text/javascript" src="./script/doT.min.js"></script>
    <script type="text/javascript" src="./script/base.js"></script>
    <script type="text/javascript" src="./script/api.js"></script>
</head>
<script type="text/javascript" src="./script/aui-tab.js"></script>
<script type="text/javascript" src="./script/jquery-3.2.0.js"></script>
</head>

<body>



    <header class="head" style="padding-top:0.4rem;">
        <!-- <div class="head-l" tapmode onclick="closeWin()"><i class="fa fa-angle-left"></i></div> -->
        <div class="head-l"></div>
        <h3>支付</h3>
        <div class="head-r"></div>
    </header>
    <div class="head-d" style="padding-top:0.4rem;"></div>

    <div class="pay-password">
        <dl>
            <!-- <p><span id="je">￥30.00</span></p> -->
            <dt>支付<span id="zf">150赚石</span></dt>
            <!-- <dd>当前赚石：5000<span>(赚石不足)</span></dd> -->
            <dd id='jf'>当前赚石：5000<span>(赚石不足)</span></dd>
        </dl>
        <h3>支付密码</h3>
        <!-- <div class="pay-password-d">
        <input type="password" >
        <input type="password">
        <input type="password" >
        <input type="password" >
        <input type="password" >
        <input type="password">
    </div>
</div>
<div class="btn-2 mt80">去支付</div> -->


<!--         <div class="pwd-box">
            <input type="password" maxlength="6" class="pwd-input" id="pwd-input">
            <div class="fake-box">
                <input type="password" readonly="">
                <input type="password" readonly="">
                <input type="password" readonly="">
                <input type="password" readonly="">
                <input type="password" readonly="">
                <input type="password" readonly="">
            </div>
        </div> -->
        <div class="pay-password-s">
            <h3>支付密码</h3>
            <div class="pwd-input1">
                <input type="password" id="pwd-input" maxlength="6">
            </div>
        </div>
    </div>

    <div class="btn-2 mt80" onclick="pay()">去支付</div>
    <div class="btn-2 mt80" onclick="goBack()" style="background:#000">暂不支付</div>

</body>
<script type="text/javascript" src="./script/api.js"></script>
<script type="text/javascript" src="./script/index.js"></script>
<script type="text/javascript">
    apiready = function() {
        token = $api.getStorage('token');
        $('#zf').html(api.pageParam.price + "赚石");
        loadIntegral();

    }

    // 订单
    function goBack(){
     api.openWin({
        name: 'order',
        url: './order.html',
        pageParam: {
          type: ""
      }
  });
 }

 function closeWin() {
    api.closeWin({});
}

function loadIntegral() {
    api.ajax({
        url: webAddress + '/api/auth/info',
        method: 'get',
        data: {
            values: {},
        },
        headers: {
            Authorization: 'Bearer ' + token,
            Accept: 'application/json',
        },
    }, function(ret, err) {
        if (ret) {
            integral = ret.data.integral;
            if(integral<api.pageParam.price){
                $('#jf').html('当前赚石：' + integral + " " + '<span>(赚石不足)</span>');
            }else{
                $('#jf').html('当前赚石：' + integral);
            }        
        } else {
            return false;
        }
    });
}

function pay() {
    var password = $('#pwd-input').val();
    if (password.length != 6) {
        api.toast({
            msg: '请输入密码！',
            duration: 2000,
            location: 'bottom'
        });
        return false;
    }
    var order_id = api.pageParam.order_id;
    api.ajax({
        url: webAddress + '/api/order/pay',
        method: 'post',
        data: {
            values: {
                order_id: order_id,
                password: password
            },
        },
        headers: {
            Authorization: 'Bearer ' + token,
            Accept: 'application/json',
        },
    }, function(ret, err) {
        if (ret) {
                // alert(JSON.stringify(ret));
                if(ret.status_code == 200){  
                    api.toast({
                      msg: ret.message,
                      duration: 2000,
                      location: 'bottom',
                      global: true,
                  });
                    // api.closeToWin({
                    //     name: 'month_classify'
                    // });
                    api.openWin({
                        name: 'pay_success',
                        url: './pay_success.html',
                        pageParam: {
                            name: 'test'
                        }
                    });
                }   
            } else {
                if (err.statusCode==400) {
                  api.toast({
                      msg: err.body.message,
                      duration: 2000,
                      location: 'bottom'
                  });

              }

          }
      });


}

    // var $input = $(".fake-box input");
    // 	$("#pwd-input").on("input", function() {
    // 		var pwd = $(this).val().trim();
    // 		for (var i = 0, len = pwd.length; i < len; i++) {
    // 			$input.eq("" + i + "").val(pwd[i]);
    // 		}
    // 		$input.each(function() {
    // 			var index = $(this).index();
    // 			if (index >= len) {
    // 				$(this).val("");
    // 			}
    // 		});
    // 		if (len == 6) {
    // 			//执行其他操作
    // 		}
    // 	});
</script>

</html>
